<p>The <code>'manhattan'</code> router is the smart version of the <code>'orthogonal'</code> router. It connects vertices with orthogonal line segments, inserting route points when necessary, while avoiding obstacles in its way. The router has useful options that determine how the algorithm behaves. These options can be passed as the <code>router.args</code> property:</p>

<table>
    <tr>
        <th>step</th>
        <td><i>number</i></td>
        <td>Size of the imaginary grid followed by the <code>'manhattan'</code> pathfinding algorithm. Lower number -> higher complexity. The <code>'manhattan'</code> router performs best when <code>step</code> has the same value as <code>dia.Paper.option.gridSize</code>. Default is <code>10</code>.</td>
    </tr>
    <tr>
        <th>padding</th>
        <td><i>number&nbsp;|&nbsp;object</i></td>
        <td>Padding applied around start/end elements and obstacles. Default is the <code>step</code> value (see above). The <code>util.normalizeSides</code> <a href="#util.normalizeSides">function</a> is used to understand the provided value. A single number is applied as padding to all sides of the elements. An object may be provided to specify values for <code>left</code>, <code>top</code>, <code>right</code>, <code>bottom</code>, <code>horizontal</code> and/or <code>vertical</code> sides.</td>
    </tr>
    <tr>
        <th>maximumLoops</th>
        <td><i>number</i></td>
        <td>The maximum number of iterations of the pathfinding loop. If the number of iterations exceeds this maximum, pathfinding is aborted and the fallback router (<code>'orthogonal'</code>) is used instead. Higher number -> higher complexity. Default is <code>2000</code>.</td>
    </tr>
    <tr>
        <th>maxAllowedDirectionChange</th>
        <td><i>number</i></td>
        <td>Maximum change of direction of the <code>'manhattan'</code> route, in degrees. Default is <code>90</code>.</td>
    </tr>
    <tr>
        <th>perpendicular</th>
        <td><i>boolean</i></td>
        <td>Should the <code>linkView.perpendicular</code> option be in effect? This causes the router not to link precisely to the anchor of the end element but rather to a point close by that is orthogonal. This creates a clean connection between the element and the first/last vertex of the route. Default is <code>true</code>.</td>
    </tr>
    <tr>
        <th>excludeEnds</th>
        <td><i>Array&lt;string&gt;</i></td>
        <td>An array with strings <code>'source'</code> and/or <code>'target'</code> that tells the algorithm that the given end element(s) should not be considered as an obstacle. Default is <code>[]</code> (both are considered obstacles).</td>
    </tr>
    <tr>
        <th>excludeTypes</th>
        <td><i>Array&lt;string&gt;</i></td>
        <td>An array of element types that should not be considered obstacles when calculating the route. Default is <code>['basic.Text']</code>.</td>
    </tr>
    <tr>
        <th>startDirections</th>
        <td><i>Array&lt;string&gt;</i></td>
        <td>An array that specifies the possible starting directions from an element. Change this in situations where you need the link to, for example, always start at the bottom of the source element (then, the value would be <code>['bottom']</code>). Default is <code>['left', 'right', 'top', 'bottom']</code> (all directions allowed).</td>
    </tr>
    <tr>
        <th>endDirections</th>
        <td><i>Array&lt;string&gt;</i></td>
        <td>An array that specifies the possible ending directions to an element. Change this in situations where you need the link to, for example, always end at the bottom of the source element (then, the value would be <code>['bottom']</code>). Default is <code>['left', 'right', 'top', 'bottom']</code> (all directions allowed).</td>
    </tr>
</table>

<p>Example:</p>

<pre><code>link.router('manhattan', {
    excludeEnds: ['source'],
    excludeTypes: ['myNamespace.MyCommentElement'],
    startDirections: ['top'],
    endDirections: ['bottom']
});</code></pre>
